<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>考试历史</title>
    <div th:replace="include/bootstrap :: bootstrap"></div>
    <style>
        .empty-data {
            text-align: center;
            margin-top: 50px;
            padding: 30px;
            background-color: #f9f9f9;
            border-radius: 5px;
        }
        .empty-data i {
            font-size: 48px;
            color: #ccc;
            display: block;
            margin-bottom: 15px;
        }
        .thumbnail {
            height: 380px;
            position: relative;
        }
        .caption {
            position: relative;
            height: 200px;
        }
        .btn-container {
            position: absolute;
            bottom: 20px;
            left: 0;
            right: 0;
        }
    </style>
</head>
<body>
<div th:replace="include/bootstrap :: StudentNav"></div>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <h3 class="text-center" style="margin-bottom: 30px;">考试历史记录</h3>
            
            <!-- 无数据时显示提示 -->
            <div th:if="${#lists.isEmpty(stuexamlist)}" class="empty-data">
                <i class="fa fa-file-text-o"></i>
                <h4>暂无考试记录</h4>
                <p>您目前没有参加过任何考试，或者考试记录已被清除。</p>
                <a th:href="@{/examList}" class="btn btn-primary">去参加考试</a>
            </div>
            
            <!-- 有数据时显示列表 -->
            <div class="row" th:if="${not #lists.isEmpty(stuexamlist)}">
                <div th:each="exams:${stuexamlist}">
                    <div class="col-md-4">
                        <div class="thumbnail">
                            <img alt="试卷图片" src="../img/peitu2.jpg" />
                            <div class="caption">
                                <h3 class="pname" th:text="${exams.pname}"></h3>
                                <p>总分: <span th:text="${exams.zscore}"></span> 分</p>
                                <p>得分: <span th:text="${exams.score}"></span> 分</p>
                                <p class="beginTime">完成时间: <span th:text="${#dates.format(exams.tjtime, 'yyyy-MM-dd HH:mm:ss')}"></span></p>
                                <div class="btn-container">
                                    <a class="btn btn-primary btn-lg btn-block beginExam" th:onclick="'javascript:Stupaper(\''+${exams.seid}+'\')'">查看答卷详情</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script th:inline="javascript">
    function Stupaper(seid) {
        var pname="";
        $.ajax({
            url: '/findBySeid',
            type: 'POST',
            dataType: 'json',
            async:false,
            contentType: 'application/json;charset=UTF-8',
            data: JSON.stringify({
                seid: seid
            }),
            success: function (data) {
                pname = data.pname;
            },
            error: function () {
                alert("系统错误，请稍后重试");
            }
        });
        
        if(pname!=''){
            $.ajax({
                url: '/findByPname',
                type: 'POST',
                dataType: 'json',
                async:false,
                contentType: 'application/json;charset=UTF-8',
                data: JSON.stringify({
                    pname: pname
                }),
                success: function (data) {
                    console.log("成功");
                    examtime = data.examtime;
                },
                error: function () {
                    alert("系统错误，请稍后重试");
                }
            });
            //获取当前日期
            var date = new Date();
            var seperator1 = "-";
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentdate = year + seperator1 + month + seperator1 + strDate;
            if(currentdate>examtime){
                window.location.href="stuPaper?seid="+seid;
            }else {
                alert("该考试正在进行中，请考试结束后查看！");
            }
        }
    }
</script>
</body>
</html>